/*
    Document   : javascript
    Author     : Filippo Mortari
    Description:
    Funzioni JavaScript.
*/
   // js voronoi, da cancellare
   /*
   var data;
   var voronoi;
   var colours = ['#A7D30C', '#019F62', 'rgba(1,159,98,0)'];
   
   


    // js voronoi, da cancellare
   google.load("visualization", "1");
   google.setOnLoadCallback(loader);
   
   
   function loader() {
   
   data = new google.visualization.DataTable();
	        data.addColumn('number', 'Age');
	        data.addColumn('number', 'Weight');
	         
    

   }
   
   
   
   // js voronoi, da cancellare
   var tooltipStrings = [];
   
   */
   
   
   var x1_primo=0;
   var y1_primo=0;
   var x=0;
   var y=0;
   
   var x1;
   var y1;
   
   var cont1=0; //numero di punti inseriti
   
   var altezza;
   var larghezza;
 
  
  jQuery(document).ready(function(){       //il metodo ready esegue il codice al suo interno quando è caricato il DOM, al contrario del load che carica anche i fogli di stile etc..        
  var offset = $('#richdraw').offset();    //.offset() ritorna un oggetto con la distanza da sinistra e dall'alto dell'elemento rispetto al documento contenitore
  $('#richdraw').svg();                    //Attach an SVG canvas to a 'richdraw'
  var svg = $('#richdraw').svg('get');     //restituisce nella variabile svg la SVG instance, prelevandola da 'richdraw'
  
  altezza = $('#richdraw').height();
  larghezza = $('#richdraw').width();
      
  $('#richdraw').mousemove(function(e){               //Bind an event handler to the "mousemove" JavaScript event
      $('#MouseX').val(e.pageX - this.offsetLeft);     //e.pageX si riferisce al documento,togliamo quindi l'offsetLeft per riferire le coordinate al div che c'interessa
      $('#MouseY').val(e.pageY - this.offsetTop);      //simile a sopra
  }); 
   
  
  $('#completa').attr('disabled','disabled'); 
   
  
  $('#richdraw').mousedown(function(e){
      
          if ($('#submit').is(':disabled')) {}
          
          else {
          
          if (cont1==0) {                                      //se è il primo punto del poligono lo memorizziamo in modo da collegare l'ultimo punto col primo
                   
                   x1_primo=parseInt(e.pageX-offset.left);
                   y1_primo=parseInt(e.pageY-offset.top);
             }
        
          svg.rect(parseInt(e.pageX-offset.left), parseInt(e.pageY-offset.top), 1, 1,{stroke: 'black', 'stroke-width': 4});            //disegniamo ogni punto inseito con un piccolo quadrato nero
        
           if (cont1>0) {
               /* svg.line(x, y,parseInt(e.pageX-offset.left), parseInt(e.pageY-offset.top), {stroke: '#E12000', 'stroke-width': 2}) */
                     //se non è il primo punto colleghiamo il punto corrente col precedente mediante una linea gialla
           }
           
           if (cont1>=2) {
             $('#completa').removeAttr('disabled','disabled');          //se abbiamo almeno tre punti diamo la possibilità di completare automaticamente il poligono
           }
           
           x = parseInt(e.pageX-offset.left);         //coordinata x dell'ultimo punto inserito
           y = parseInt(e.pageY-offset.top);          //coordinata y dell'ultimo punto inserito
                                              //incrementiamo il contatore dei punti del poligono
            // js voronoi, da cancellare                                  //Math.abs((e.pageY - this.offsetTop)- altezza)
           x1 = parseInt(e.pageX-offset.left);
           y1 = parseInt(e.pageY-offset.top);
           
           /*
           data.addRows(1);
           
           data.setValue(cont1, 0, x1);
           data.setValue(cont1, 1, y1);
           tooltipStrings[cont1] = "x = " + x1 + ", y = " + y1;
           */
           
           cont1++;
           
          }
							
           
});
   
function timedCount(){
    
    var xi=0;
    xi= xi+1;
} 
 
 
 $('#completa').click(function () { 
     
       svg.line(x1_primo, y1_primo, x, y, {stroke: '#E12000', 'stroke-width': 2});           // colleghiamo il primo e l'ultimo punto iserito con una linea
    
       $('#completa').attr('disabled','disabled');                                       //essendo completato il disegno del poligono disabilitiamo bottone Completa
      
       x1_primo=0; 
       y1_primo=0;
       x=0;
       y=0;
    
       
 });
 
  
   
   
   $("#clear").click(function () { 
       
      $('#richdraw').svg('get').clear();
      $('#submit').removeAttr('disabled');
      
       x1_primo=0;
       y1_primo=0;
       x=0;
       y=0;
       /* data.removeRows(0, data.getNumberOfRows()); */
       cont1=0;
       /*
       // js voronoi, da cancellare
       tooltipStrings = [];
       document.getElementById("voronoiDiv").innerHTML=" ";
       */
   });
 
})


function drawlines(){
   
   
    var btime = false;

    var from = 0.0
    var to   = 1.0;
    var timer1 = from;

    var gr = document.getElementsByTagName('g');
    gr = gr[1];
    gr.setAttribute('stroke-opacity', from.toString());





    var t = setInterval(function(){
    timer1 = parseFloat(gr.getAttribute('stroke-opacity'));
    if (timer1 == to)
        btime = true;
    else{
    var grx = parseFloat(gr.getAttribute('stroke-opacity'));
    grx = grx + 0.05;
    grx = Math.round(grx*100)/100;

    gr.setAttribute('stroke-opacity', grx.toString());
    }    




    },100);


    c = setTimeout(function(){
        if (btime == true)
        clearInterval(t);

    },10000);
                   
                   
}

function call() {

    if(cont1 <= 2) {
        alert("inserire almeno 3 punti");
        return;
    }
    
    else {
    // js voronoi, da cancellare
    /*
    voronoi = new greg.ross.visualisation.Voronoi(document.getElementById("voronoiDiv"));
    voronoi.draw(data, {xPos: 0, yPos: 0, width: 900, height: 500, colourGradient: colours, fillPolygons: false, tooltips: tooltipStrings});
    
    */
   
   
    $('#submit').attr('disabled','disabled');   //disabilita il submit dopo averlo utilizzato
    var notConvex = -1;         
    var method = 'POST';                    // specifica il metodo POST per comunicare con il server
    var URL = 'servlet/WebApp';             // la comunicazione avviene con la servlet WebApp posta sul server
    var svgdata = {                         // dati inviati: html del grafico inserito e contatore punti;
        'result': $('#richdraw').html(),
        'cont1': cont1,
        'wid' : larghezza,
        'hei' : altezza
    };
 

   var ajax= $.ajax({                   //gestore della chiamata ajax
        url: URL,
        type: method,
        data: svgdata,
        dataType: "image/svg+xml",
        timeout: 100000,
        
        
        success: function(out){
          
            if (out==notConvex) {
                  //this is always true  
                  alert("qualcosa non va");
                                       
            }
 
            else{
                
                   $('#richdraw').svg('get').load(out, {addTo: true}); //carica nel richdraw svg ottenuto come risultato dell'esecuzione dell'algoritmo
                   drawlines();
                   
                   
                   
                        
                   
                   
                   

            }

        },

        
        
        error: function(e) {
                alert("Errore non previsto: ");
                
               
        }

    });	
    
    } 
}   